4
4
.
.
3
3
.
.
2
2
S
S
p
p
a
a
c
c
e
e
r
r
I
I
n
n
f
f
o
o
Spacer View is used to insert space between child Views.
You can control its size in both directions (depending if you need it for Roe or Column Container).
Syntax
import androidx.compose.foundation.layout.Spacer
Spacer(Modifier.width (20.dp)) //For Row
Spacer(Modifier.height(20.dp)) //For Column
E
E
x
x
a
a
m
m
p
p
l
l
e
e
In this example we use Spacers to put some room between child Text Views.
MainActivity.kt
package com.example.testcompose
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.compose.foundation.Text
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.setContent
import androidx.compose.ui.unit.dp
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
Row(Modifier.fillMaxSize()) {
Spacer(Modifier.width(20.dp))
Text("First", Modifier.border(2.dp, Color.Red).padding(10.dp))
Spacer(Modifier.width(20.dp))
Text("Second", Modifier.border(2.dp, Color.Red).padding(10.dp))
Spacer(Modifier.width(20.dp))
Text("Third", Modifier.border(2.dp, Color.Red).padding(10.dp))
}
}
}
}
Row Column
